<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <h:outputStylesheet library="css" name="style.css"/>
    </h:head>
    <h:body>
        <div id="outer">
            <div id="wrapper">
                <div id="body-bot">
                    <div id="body-top">
                        <div id="logo">
                            <h1>TRANSPORTATION SERVICE</h1>
                            <p>We care about your cargo</p>
                        </div>
                        <div id="nav">
                            <ul>
                                <li><a href="Home.xhtml">Home</a></li>
                                <li><a href="index9.xhtml">SERVICES</a></li>
                                <li><a href="http://www.free-css.com/">CONTACT US</a></li>
                                <li><a href="http://www.free-css.com/">ABOUT US</a></li>
                            </ul>
                            <div class="clear"> </div>
                        </div>
                        <h:form id="form1">
                            <div id="greenbox1">
                                <!-- <h2 style="color: brown">Service Types</h2>-->


                                <p:tree value="#{allservicebean.root}" selectionMode="single"  var="node" dynamic="true">
                                    <p:ajax event="select" oncomplete="openMyDiv()" listener="#{allservicebean.onNodeSelect}"
                                            update=":form1:nameid,:form1:rateid,:form1:terminal1id,:form1:terminal2id,:form1:commentid,:form1:routeid"  />
                                    <p:treeNode>
                                        <h:outputText value="#{node.name}" />
                                    </p:treeNode>
                                </p:tree>
                            </div>
                            <div class="greybox1" id="emptypage">

                            </div>
                            <div class="greybox1" id="page3">

                                <h:outputLabel value="Name :"/>
                                <h:outputLabel value="#{allservicebean.ts.name}" id="nameid"/>
                                <p:rating value="#{allservicebean.rate}" readonly="true" id="rateid"/><h:outputText value="#{allservicebean.count}"/>
                                <br></br>
                                Terminals :<h:outputLabel 
                                    value="#{allservicebean.ts.terminalByTerminal1.point.name} , " id="terminal1id"/>
                                <h:outputLabel 
                                    value="#{allservicebean.ts.terminalByTerminal2.point.name}" 
                                    id="terminal2id"/>
                                <br></br>
                                <h:outputLabel value="Route :"/>
                                <ui:repeat value="#{allservicebean.routes}" var="route" id="routeid">
                                    <h:outputText value="-->" />                               
                                    <h:outputText value="#{route.point.name}" />
                                </ui:repeat>
                                <br></br>                        
                                <h:outputLabel value="public opinion polls:"/>
                                <br></br>
                                <p:rating value="#{allservicebean.newrate}" id="newrateid" />                        
                                <p:commandButton value="Rate"  actionListener="#{allservicebean.rateMethod()}" update=":form1:rateid,:form1:newrateid"/>
                                <h:outputText value="&lt;br/&gt;" escape="false" />
                                <h3 style="margin-top: 0;color: darkolivegreen">Comments</h3>
                                <br></br>
                                <h:dataTable value="#{allservicebean.comments}" var="item" id="commentid">
                                    <p:column>
                                        <div style="background: rgb(194, 201, 189); width: 550px; height:40px;">
                                            <h:outputLabel value="#{item.comment}"/>
                                            <h:outputText value="&lt;br/&gt;" escape="false" /> 
                                        </div>
                                    </p:column>
                                </h:dataTable>
                                <h3 style="margin-top: 0;color: darkolivegreen">Write Your Comment</h3>
                                <p:inputTextarea rows="5" cols="50" 
                                                 value="#{allservicebean.comment}" 
                                                 style="color:black;margin:10px" id="textcommentarea"/>
                                <p:commandButton id="btnComment"
                                                 oncomplete="#{allservicebean.writeCommets}" 
                                                 value="comment" style="margin:20px"
                                                 update=":form1:commentid:,form1:textcommentarea,:form1:btnComment"
                                                 action="#{allservicebean.writeComment()}"/>

                            </div>
                            <div id="page4" class="greybox1">
                                E-mail:
                                <br/>
                                <h:inputText id="txtEmail" class="textInput" 
                                             required="true" value="#{userbean.email}">
                                    <f:validateRegex 
                                        pattern="[\w\.-]*[a-zA-Z0-9_]@[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]"/>
                                </h:inputText>

                                <h:inputHidden id="txtHide" value="#{userbean.flag}" />


                                <br/>
                                Password:
                                <br/>
                                <h:inputSecret id="txtPass" class="textInput"
                                               value="#{userbean.pass}" required="true">
                                    <f:validateLength minimum="3" maximum="20"/>
                                </h:inputSecret><br/>

                                <br/>

                                <br/><br/>
                                Or <p:commandLink
                                    oncomplete="openMyDiv3()"> register </p:commandLink>if you have no account

                                <p:commandButton oncomplete="openMyDiv2()" 
                                                 id="commandd"
                                                 value="Login" 
                                                 style="margin:20px" 
                                                 action="#{userbean.login()}"
                                                 update="commandd,:form1:btnComment,txtHide" />
                            </div>
                            <div id="page5" class="greybox1">
                                <br/>
                                <font size="5px"><b>Registration Form</b></font>
                                <br/><br/><br/>
                                <center>
                                    User ID:
                                    <br/>
                                    <h:inputText class="textInput" id="txtID" required="true"
                                                 value="#{userbean.id}" />
                                    <br/>
                                    E-mail: 
                                    <br/>
                                    <h:inputText class="textInput" id="txtEmailRegister" required="true"
                                                 value="#{userbean.email}">
                                        <f:validateRegex pattern="[\w\.-]*[a-zA-Z0-9_]@[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]"/>
                                    </h:inputText>
                                    <br/>
                                    Password:
                                    <br/>
                                    <h:inputSecret class="textInput" id="txtPassRegister" required="true"
                                                   value="#{userbean.pass}"/>
                                    <br/>
                                    <h:commandButton class="vote" action="#{userbean.register()}" value="Submit"/>
                                </center>
                                <br/><br/>
                            </div>
                        </h:form>
                    </div>
                </div>
            </div>
        </div>
        <div id="copyright"> &copy; Copyright information goes here. All rights reserved | designed by <a href="http://www.freewebsitetemplates.com">free website templates</a></div>
        <h:outputScript library="scripts" name="jquery-1.10.2.min.js"/>
        <h:outputScript library="scripts" name="jquery-migrate-1.2.1.min.js"/>

        <script type='text/javascript'>
            var $jq = jQuery.noConflict(true);

            $(document).ready(function() {
//                alert("nohssa");
                document.getElementById("page3").style.display = "none";
                document.getElementById("page4").style.display = "none";
                document.getElementById("page5").style.display = "none";
            }
            );
            function openMyDiv() {
                document.getElementById("emptypage").style.display = "none";
                document.getElementById("page3").style.display = "block";
            }

            function openMyDiv1() {
                document.getElementById("page3").style.display = "none";
                document.getElementById("page4").style.display = "block";
            }
            function openMyDiv2() {
                console.log("func");
                var result = document.getElementById("form1:txtHide").value;
                console.log(result);
                if (result === "true")
                {
                    document.getElementById("page4").style.display = "none";
                    document.getElementById("page3").style.display = "block";
                }
            }

            function openMyDiv3() {
//                console.log("func");
//                var result = document.getElementById("form1:txtHide").value;
//                console.log(result);
//                if(result === "true")
//                {
                document.getElementById("page4").style.display = "none";
                document.getElementById("page5").style.display = "block";
//                }   
            }

        </script>
    </h:body>
</html>